<template>
  <div class="right-main">
    <div class="tob-bar">
      <el-breadcrumb separator=">">
        <el-breadcrumb-item :to="{ path: '/' }">首页</el-breadcrumb-item>
        <el-breadcrumb-item :to="{ path: '/case/fundPayBackList' }">公积金补缴规则</el-breadcrumb-item>
        <el-breadcrumb-item>查看</el-breadcrumb-item>
      </el-breadcrumb>
    </div>
    <div class="mainContainer viewPayBackPage">
      <!-- 社保补缴表单 -->
      <div class="customform shebaoform">
        <el-form :inline="true" label-width="120px" label-position="left">
          <div class="el-form--inline">
            <el-form-item label="参保地">
              <div class="el-input form-control-static">{{rule.addrName}}</div>
            </el-form-item>
            <el-form-item label="服务公司">
              <div class="el-input form-control-static">{{rule.companyName}}</div>
            </el-form-item>
            <el-form-item label="可补缴月份">
              <div class="el-input form-control-static">
                {{monthType[rule.allowSuppTypeCode]}}
                <span v-show="rule.allowSuppTypeCode == 3">：{{rule.allowYearMonth}}</span>
                <span v-show="rule.allowSuppTypeCode == 4">：{{rule.allowMonths}}</span>
              </div>
            </el-form-item>
          </div>
          <div class="el-form--inline">
            <el-form-item label="补缴基数">
              <div class="el-input form-control-static">
                {{Gloab.dataCode[rule.suppBaseRuleCode]}}<span v-show="rule.suppBaseRuleCode ==40006002">：{{rule.baseMinAmt}}~{{rule.baseMaxAmt}}</span>
              </div>
            </el-form-item>
            <el-form-item label="补缴险种">
              <div class="el-input form-control-static">
                 <span v-for = " (item,index) in rule.typeCode.split(',') " :key="index">
                {{Gloab.dataCode[item]}}
            </span>
              </div>
            </el-form-item>
          </div>
        </el-form>
        <div class="page-form-btn">
          <el-button @click="back">取消</el-button>
        </div>
      </div>

      <!-- 社保补缴表单结束 -->
    </div>
  </div>
</template>

<script>
  import Http from "../../libs/http.js";
  export default {
    name: "viewPayBack",
    data() {
      return {
        monthType:{
          "1":'无限制',
          "2":'不可补缴',
          "3":'限制补缴年月',
          "4":'限制补缴月数'
        },
        rule:{}
      };
    },
    created() {
      this.getDetail();
    },
    methods: {
      getDetail: function() {
        Http.api.get("/case/accfund/rule/"+this.$route.query.id).then(res => {
          this.rule= res.data;
        });
      },
      //编辑
      back() {
        this.$router.push({ path: "/case/fundPayBackList" });
      }
    }
  };
</script>
